import 'package:flutter/material.dart' ;
import 'package:flutter/services.dart';
import 'package:flutter_picker/flutter_picker.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:mfkb/plugin/MyBehavior.dart';
import 'package:mfkb/service/FunService.dart';
import 'package:toast/toast.dart';

class Electricty extends StatefulWidget {
  @override
  _ElectrictyState createState() => _ElectrictyState();
}

class _ElectrictyState extends State<Electricty> {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  List area = [] ;
  String area_select ;
  String area_txt = null ;
  String _build = null ;
  String _room = null ;
  String electricty = "0.0" ;

  @override
  void initState() {
    super.initState();
    FunService().eArea().then((value){
      print(value) ;
      if(value["code"] == 200){
        area = value["data"] ; 
        setState(() {});
      }else{
        Toast.show(value["msg"], context) ;
      }
    }) ;
  }

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.dark ,
      child: Scaffold(
        key: _scaffoldKey ,
        body: Container(
          color:Color.fromARGB(255, 245, 246, 248) ,
          child: Column(
            children: <Widget>[
              Container(
                height: MediaQuery.of(context).padding.top ,
              ) ,
              Container(
                height: 45,
                child: Row(
                  children: <Widget>[
                    Container(
                      width: 17,
                      height: 17,
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(19)),
                      child: GestureDetector(
                        child: Container(
                          width: 17,
                          height: 17,
                          child: Image.asset("assets/images/back.png" , fit: BoxFit.fill,),
                        ),
                        onTap: (){
                          Navigator.of(context).pop() ;
                        },
                      ),
                    ) ,
                    Expanded(
                      child: Container(
                        child: Center(
                          child: Text("电费查询" , style: TextStyle( 
                            color: Color.fromARGB(255, 19 , 28 , 53) , 
                            fontSize: ScreenUtil().setSp(18) , 
                            fontWeight: FontWeight.bold  
                          ),), 
                        ),
                      ),
                    ) ,
                    Container(
                      height: 17 ,
                      width: 36 ,
                      margin: EdgeInsets.only(right:ScreenUtil().setWidth(15)) ,
                    ) 
                  ],
                ),
              ) ,
              Container(
                height: ScreenUtil().setHeight(320),
                margin: EdgeInsets.only(top:ScreenUtil().setHeight(10) , left:ScreenUtil().setWidth(10) , right:ScreenUtil().setWidth(10)),
                decoration: BoxDecoration(
                  color: Colors.white ,
                  borderRadius: BorderRadius.all(Radius.circular(16)) 
                ) ,
                child: Column(
                  children: <Widget>[
                    Container(
                      height: ScreenUtil().setHeight(50),
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(18) , right:ScreenUtil().setWidth(17) , top:ScreenUtil().setHeight(24)),
                      decoration: BoxDecoration(
                        color: Color.fromARGB(255, 246, 246, 248) ,
                        borderRadius: BorderRadius.all(
                          Radius.circular(8)
                        )
                      ),
                      child: GestureDetector(
                        child: Container(
                          child: Row(
                            children: <Widget>[
                              Expanded(
                                child: Container(
                                  margin: EdgeInsets.only(left:ScreenUtil().setWidth(12)),
                                  child: Text(area_txt == null ? "请选择区域" : area_txt , style: TextStyle(
                                    fontSize: ScreenUtil().setSp(14) ,
                                    color: Color.fromARGB(255, 121, 132, 155)
                                  ),),
                                ) ,
                              ) ,
                              Container(
                                width: ScreenUtil().setWidth(16),
                                height: ScreenUtil().setWidth(16),
                                margin: EdgeInsets.only(right:ScreenUtil().setWidth(5)),
                                child: Image.asset("assets/images/more_2x.png"),
                              )
                            ],
                          ),
                        ),
                        onTap: (){
                          print(area) ;
                          new Picker(
                            adapter: PickerDataAdapter<String>(
                              data: List.generate(area.length, (index){
                                return PickerItem(
                                  text: Text(area[index]["name"]) ,
                                  value: area[index]["id"]
                                ) ;
                              })
                            ),
                            confirmText: "确认",
                            confirmTextStyle: TextStyle(
                              fontSize: ScreenUtil().setSp(16) ,
                              color: Color.fromARGB(255, 0, 195, 206)
                            ),
                            cancelText: "取消" ,
                            cancelTextStyle: TextStyle(
                              fontSize: ScreenUtil().setSp(16) ,
                              color: Color.fromARGB(255, 0, 195, 206)
                            ),
                            changeToFirst: true ,
                            textScaleFactor: 1.3 ,
                            textAlign: TextAlign.left , 
                            textStyle: const TextStyle(color: Color.fromARGB(255, 51, 51, 51)),
                            selectedTextStyle: TextStyle(color: Color.fromARGB(255, 51, 51, 51)),
                            columnPadding: const EdgeInsets.all(8.0), 
                            onConfirm: (Picker picker, List value) {
                              area_select = picker.getSelectedValues()[0] ;
                              area_txt = area[value[0]]["name"] ;
                              setState(() {});
                            }
                          ).show(_scaffoldKey.currentState) ;
                        },
                      ),
                    ) ,
                    Container(
                      height: ScreenUtil().setHeight(50),
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(18) , right:ScreenUtil().setWidth(17) , top:ScreenUtil().setHeight(10)),
                      decoration: BoxDecoration(
                        color: Color.fromARGB(255, 246, 246, 248) ,
                        borderRadius: BorderRadius.all(
                          Radius.circular(8)
                        )
                      ),
                      child: Container(
                        margin: EdgeInsets.only(left:ScreenUtil().setWidth(12) , right:ScreenUtil().setWidth(12)),
                        child: TextField(
                          decoration: InputDecoration(
                            hintText: "请输入楼栋" ,
                            border: InputBorder.none ,
                            hintStyle: TextStyle(
                              fontSize: ScreenUtil().setSp(14) ,
                              color: Color.fromARGB(255, 121, 132, 155)
                            ) 
                          ),
                          onChanged: (value){
                            _build = value ;
                          },
                        ),
                      ),
                    ) ,
                    Container(
                      height: ScreenUtil().setHeight(50),
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(18) , right:ScreenUtil().setWidth(17) , top:ScreenUtil().setHeight(10)),
                      decoration: BoxDecoration(
                        color: Color.fromARGB(255, 246, 246, 248) ,
                        borderRadius: BorderRadius.all(
                          Radius.circular(8)
                        )
                      ),
                      child: Container(
                        margin: EdgeInsets.only(left:ScreenUtil().setWidth(12) , right:ScreenUtil().setWidth(12)),
                        child: TextField(
                          decoration: InputDecoration(
                            hintText: "请输入宿舍号" ,
                            border: InputBorder.none ,
                            hintStyle: TextStyle(
                              fontSize: ScreenUtil().setSp(14) ,
                              color: Color.fromARGB(255, 121, 132, 155)
                            )
                          ),
                          onChanged: (value){
                            _room = value ;
                          },
                        ),
                      ),
                    ) ,
                    GestureDetector(
                      child: Container(
                        height: ScreenUtil().setHeight(50),
                        margin: EdgeInsets.only(left:ScreenUtil().setWidth(18) , right:ScreenUtil().setWidth(17) , top:ScreenUtil().setHeight(35)),
                        decoration: BoxDecoration(
                          color: Color.fromARGB(255, 0, 195, 206) ,
                          borderRadius: BorderRadius.all(
                            Radius.circular(8)
                          )
                        ),
                        child: Center(
                          child: Text("立即查询" , style: TextStyle(
                            fontSize: ScreenUtil().setSp(18) ,
                            fontWeight: FontWeight.bold ,
                            color: Colors.white
                          ),),
                        ),
                      ) ,
                      onTap: (){
                        if(_build == null && _room == null && area_select == null){
                          Toast.show("请将参数填写完整", context) ;
                          return ;
                        }
                        FunService().electricty(build: _build.trim() , room: _room.trim() , area: area_select).then((value){
                          if(value["code"] == 200){
                            print(value) ;
                            setState(() {
                              electricty = value["data"][0]["balance"] ;
                            });
                          }else{
                            Toast.show(value["msg"], context) ;
                          }
                        }) ;
                      },
                    ),
                  ]
                )
              ) ,
              Container(
                height: ScreenUtil().setHeight(60),
                margin: EdgeInsets.only(left:ScreenUtil().setWidth(10) , right:ScreenUtil().setWidth(12) , top:ScreenUtil().setHeight(12)),
                decoration: BoxDecoration(
                  color: Colors.white ,
                  borderRadius: BorderRadius.all(Radius.circular(16)) ,
                ) ,
                child: Row(
                  children: <Widget>[
                    Container(
                      width: ScreenUtil().setHeight(24),
                      height: ScreenUtil().setHeight(24),
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(15)),
                      child: Image.asset("assets/images/df_icon.png"),
                    ) ,
                    Expanded(
                      child: Container(
                        margin: EdgeInsets.only(left:ScreenUtil().setWidth(15)),
                        child: Text(electricty.toString() , style: TextStyle(
                          fontSize: ScreenUtil().setSp(22) ,
                          fontWeight: FontWeight.bold ,
                          color: Color.fromARGB(255, 19, 28, 53)
                        ),),
                      ),
                    )  ,
                    Container(
                      width: ScreenUtil().setWidth(80),
                      margin: EdgeInsets.only(right:ScreenUtil().setWidth(15)),
                      child: Text("当前电费" , style: TextStyle(
                        fontSize: ScreenUtil().setSp(12) ,
                        color: Color.fromARGB(255, 121, 132, 155),
                        fontWeight: FontWeight.bold
                      ),textAlign: TextAlign.end,),
                    )
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}